import React, { useEffect, useState } from 'react';
import { Table, Button, Modal, Form, Input, message, Space, Popconfirm } from 'antd';
import {
  listCommunityTags,
  addCommunityTag,
  updateCommunityTag,
  deleteCommunityTag,
} from '@/api/communityTagController';

const PostTags: React.FC = () => {
  const [tags, setTags] = useState<API.CommunityTag[]>([]);
  const [isModalVisible, setIsModalVisible] = useState(false);
  const [form] = Form.useForm();
  const [editingId, setEditingId] = useState<string | null>(null);
  const [loading, setLoading] = useState(false);

  const fetchTags = async () => {
    try {
      setLoading(true);
      const res = await listCommunityTags();
      if (res.data) {
        setTags(res.data);
      }
    } catch (error) {
      message.error('获取标签列表失败');
    } finally {
      setLoading(false);
    }
  };

  useEffect(() => {
    fetchTags();
  }, []);

  const handleAdd = () => {
    setEditingId(null);
    form.resetFields();
    setIsModalVisible(true);
  };

  const handleEdit = (record: API.CommunityTag) => {
    setEditingId(record.id);
    form.setFieldsValue({
      tagcode: record.tagcode,
      tagnamezh: record.tagnamezh,
    });
    setIsModalVisible(true);
  };

  const handleDelete = async (id: string) => {
    try {
      await deleteCommunityTag({ id });
      message.success('删除成功');
      fetchTags();
    } catch (error) {
      message.error('删除失败');
    }
  };

  const handleModalOk = async () => {
    try {
      const values = await form.validateFields();
      if (editingId) {
        await updateCommunityTag({
          id: editingId,
          ...values,
        });
        message.success('更新成功');
      } else {
        await addCommunityTag(values);
        message.success('添加成功');
      }
      setIsModalVisible(false);
      fetchTags();
    } catch (error) {
      message.error(editingId ? '更新失败' : '添加失败');
    }
  };

  const columns = [
    {
      title: 'ID',
      dataIndex: 'id',
      key: 'id',
    },
    {
      title: '标签代码',
      dataIndex: 'tagcode',
      key: 'tagcode',
    },
    {
      title: '标签名称',
      dataIndex: 'tagnamezh',
      key: 'tagnamezh',
    },
    {
      title: '创建时间',
      dataIndex: 'createtime',
      key: 'createtime',
    },
    {
      title: '更新时间',
      dataIndex: 'updatetime',
      key: 'updatetime',
    },
    {
      title: '操作',
      key: 'action',
      render: (_: any, record: API.CommunityTag) => (
        <Space>
          <Button type="link" onClick={() => handleEdit(record)}>
            编辑
          </Button>
          <Popconfirm
            title="确定要删除吗？"
            onConfirm={() => handleDelete(record.id)}
          >
            <Button type="link" danger>
              删除
            </Button>
          </Popconfirm>
        </Space>
      ),
    },
  ];

  return (
    <div>
      <div style={{ marginBottom: 16 }}>
        <Button type="primary" onClick={handleAdd}>
          添加标签
        </Button>
      </div>
      <Table
        columns={columns}
        dataSource={tags}
        rowKey="id"
        loading={loading}
      />
      <Modal
        title={editingId ? '编辑标签' : '添加标签'}
        open={isModalVisible}
        onOk={handleModalOk}
        onCancel={() => setIsModalVisible(false)}
        okText="确认"
        cancelText="取消"
      >
        <Form form={form} layout="vertical">
          <Form.Item
            name="tagcode"
            label="标签代码"
            rules={[{ required: true, message: '请输入标签代码' }]}
          >
            <Input type="number" />
          </Form.Item>
          <Form.Item
            name="tagnamezh"
            label="标签名称"
            rules={[{ required: true, message: '请输入标签名称' }]}
          >
            <Input />
          </Form.Item>
        </Form>
      </Modal>
    </div>
  );
};

export default PostTags; 